<?php
$renderAdv  = $this->renderType!=Apps_Plugin_Grid_Search_Abstract::RENDER_SIMPLE;

$grid = $this->grid;
$form = $this->form;
$rq   = $grid->getRequest();

// Keyword
$advKeyword     = $this->advKeyword;
$advDelimiter   = $this->advDelimiter;

$xhtml  = '';
$xhtml .= $this->formText('s_keyword', $rq->getParam('s_keyword'), array('class' => 'medium search-box no-hint', 'id' => 'search-input', 'placeholder' => 'Search', 'size' => 15, 'title' => 'Nhập thông tin cần tìm kiếm. Cú pháp tìm kiếm nâng cao: >[key]:value-condition;'));
$xhtml .= '<input type="submit" class="btn btn-primary search-btn search-submit no-hint" title="Tìm kiếm" value="Search"/>';
$xhtml .= '<a href="##" class="btn btn-large search-adv" no-hint" title="Tìm kiếm nâng cao" data-toggle="modal" data-target="#adv-search"><i class="icon-zoom-in"></i></a>';
if($renderAdv) { $xhtml .= '<a href="##" class="search-reset" title="Hủy bỏ tìm kiếm" /><i class="icon-remove-circle"></i></a>'; }

$xhtml  = '<div class="search-div"><div style="position:relative">' . $xhtml . '</div></div>' ;
echo $xhtml;
?>
<script>
    $(function(){
    	var sbox   = $('.search-box');
    	var sreset = $('.search-reset');
    	var frm    = sbox.parents('form')[0];
    	window.searchSubmit = function(){ frm.submit() };
        sbox.live('keypress', function(e){
            if(e.which==13){window.searchSubmit()}
        }).live('focus', function(e) {
            $(this).css({'width': '350px'});
        }).live('blur', function(e) {
        	$(this).css({'width': '210px'});
        });

        if(sbox.val()) {
            sreset.show().live('click', function(){
                sbox.val('');
                window.searchSubmit()
            });
        }
    });
</script>

<?php if($renderAdv) :?>
<div class="modal hide fade adv-search" id="adv-search">
    <div class="modal-header">
        <a class="close" data-dismiss="modal">×</a>
        <h3>Tìm kiếm nâng cao</h3>
        <span><i>Lựa chọn</i>, <i>chấp nhận</i>, <i>tìm kiếm</i>. </span>
	</div>
    <div class="modal-body">
        <div class="form-horizontal">
    	    <?php echo $form; ?>
    	</div>
    </div>
    <div class="modal-footer">
        <input type="reset" data-dismiss="modal" class="btn" value="Thoát"/>
        <a href="##" data-dismiss="modal" class="btn btn-primary search-adv-save">Chấp nhận</a>
    </div>
</div><!-- /#adv-search -->
<script>
$(function(){
    $.fn.getRadioInput  = function(){ this._cacheRadioInput  = this._cacheRadioInput  || $(this).parents('label.radio').find('.search-criterion')   ; return this._cacheRadioInput};
    $.fn.getRadioInputs = function(){ this._cacheRadioInputs = this._cacheRadioInputs || $(this).parents('div.controls').find('.search-criterion'); return this._cacheRadioInputs};

	var criterion  = $('.search-criterion');
	var btnSave    = $('.search-adv-save');
	var txtKeyword = $('#search-input');
	var radioCheck = $('.search-criterion-select');

	// Trigger save by press Enter
	criterion.live('keypress', function(e){ if(e.which == 13) { btnSave.trigger('click'); } }).live('blur', function(e){ recheck(); });
	// Save - render query to searchbox
	btnSave.live('click', function(e) {
        var q = [], e, v, a;
        criterion.not('.search-criterion-disabled').each(function(i,e) {
        	e = $(e);
        	a = e.attr('type');
            if((a == 'radio' || a == 'checkbox') && !e.attr('checked')) { return null; /* Skip */ }

        	if(v = e.val()) {
                q.push([e.attr('data-search-tpl'), v].join(''));
            }
        });
        if(!!q[0]) { q = '<?php echo $advKeyword ?>' + q.join('<?php echo $advDelimiter ?>'); txtKeyword.val(q);window.searchSubmit() }
    });
    // Handle radio change
	radioCheck.live('change', function(e) { recheck(); });

	function recheck() {
		console.log('recheck');
		radioCheck.filter(':checked').each(function(i, element) {
    		var t = $(element), v;
    		t.getRadioInputs().addClass('search-criterion-disabled');
    		t.getRadioInput().removeClass('search-criterion-disabled');
		});
	}
	// Activate checked elements
    radioCheck.filter(':checked').getRadioInput().removeClass('search-criterion-disabled');
    // Active radio when children clicked
    $('.date-group .search-criterion').live('focus', function(e){$(this).parents('.date-group').children('.search-criterion-select').attr('checked', 'checked')});
});
</script>
<?php endif; ?>